/**
 * Primary styles
 *
 * Author: IPython Development Team
 */


body {
    overflow: hidden;
}

span#save_widget {
    padding: 5px;
    margin: 0px 0px 0px 0px;
    display:inline-block;
}

span#save_status {
    opacity:0.5;
}

span#notebook_name {
    height: 1em;
    line-height: 1em;
    padding: 3px;
    border: none;
    font-size: 146.5%;
}

/*hack to avoid bokeh.css integration side effect*/
.ui-dialog-titlebar {
    height: 31px;
}

.ui-menubar-item .ui-button .ui-button-text {
    padding: 0.4em 1.0em;
    font-size: 100%;
}

.ui-menu {
  -moz-box-shadow:    0px 6px 10px -1px #adadad;
  -webkit-box-shadow: 0px 6px 10px -1px #adadad;
  box-shadow:         0px 6px 10px -1px #adadad;
}

.ui-menu .ui-menu-item a {
    padding: 2px 1.6em;
}

.ui-menu hr {
    margin: 0.3em 0;
}

#menubar_container {
    position: relative;
    width:100%;
    background-color: #DBDBDB;
    height: 118px;
}

#notification {
    position: absolute;
    right: 3px;
    top: 3px;
    height: 25px;
    padding: 3px 6px;
    z-index: 10;
}

#toolbar {
    padding: 3px 15px;
}

#cell_type {
    font-size: 85%;
}


div#main_app {
    width: 100%;
}

span#quick_help_area {
    position: static;
    padding: 5px 0px;
    margin: 0px 0px 0px 0px;
}

.help_string {
    float: right;
    width: 170px;
    padding: 0px 5px;
    text-align: left;
    font-size: 85%;
}

.help_string_label {
    float: right;
    font-size: 85%;
}

div#notebook_panel {
    margin: 0px 0px 0px 0px;
    padding: 20px;
    background-color: #B3B3B3;

    overflow-y: scroll;
    overflow-x: auto;
}

div#notebook {
    background-color: #FFFFFF;
    margin: 0;
    max-width: 996px;
    /* This spaces the cell away from the edge of the notebook area */
    padding: 5px 5px 15px 5px;
}

div#pager_splitter {
    height: 8px;
}

div#pager {
    padding: 15px;
    overflow: auto;
    display: none;
}

div.cell {
    width: 100%;
    /*padding: 5px 5px 5px 0px;*/
    /* This acts as a spacer between cells, that is outside the border */
    margin: 5px 0px 5px 0px;
}

.code_cell {
    background-color: white;
}

.code_cell .content {
    border: 1px solid #E6E6E6;
    border-left: none;
    border-radius: 0 3px 3px 0;
}

/* any special styling for code cells that are currently running goes here */
.code_cell.running {
    background-color: grey;
}

.option_bar {
    padding:5px;
    background-color: #E6E6E6;
    width:25px;
    min-height:30px;
}

.option_bar > * {
    margin: 0px 0px 5px 0px;
}

.option_bar i {
    opacity:0.4;
}

.selected .option_bar i {
    opacity:1;
}

.selected .option_bar {
    background-color: #53B4D5;
}

.selected .content, .selected .output_subarea {
    border-color: #DDDDDD;
}

.selected .input {
    opacity:1;
}

.selected .output_stream * {
    opacity:1;
}

.input {
    opacity:0.4;
}

.output_stream * {
    opacity:0.4;
}

.output_only.code_cell .content {
    border: none;
}

.output_only .input {
    display:none;
}

.output_only .output {
    border: none;
}

.output_only .output_prompt {
    display:none;
}

.output_only .output_stream {
    display:none;
}

.output_only .option_bar > * {
    display:none;
}

.output_only .output_subarea {
    border:none;
}

div.prompt {
    /* This needs to be wide enough for 3 digit prompt numbers: In[100]: */
    /*width: 11ex;*/
    /* This 0.4em is tuned to match the padding on the CodeMirror editor. */
    /*padding: 0.4em;
    margin: 0px;
    text-align:right;
    */
    font-size: 50%;
    font-family: monospace;
}

div.input {
    /*page-break-inside: avoid;*/


}

/* input_area and input_prompt must match in top border and margin for alignment */
div.input_area {
    color: black;
    /*
    border: 1px solid #ddd;
    border-radius: 3px;
    background: #f7f7f7;*/
    padding:5px;
}

div.input_prompt {
    /*color: navy;
    border-top: 1px solid transparent;
    */
}

div.output {
    /* This is a spacer between the input and output of each cell */
    /*margin-top: 5px;*/
}

div.output_prompt {
    color: darkred;
}

/* This class is the outer container of all output sections. */
div.output_area {
    /*padding: 10px;*/
    /*page-break-inside: avoid;*/
}

/* This class is for the output subarea inside the output_area and after
   the prompt div. */
.output_subarea {
    /*padding: 0.4em 6.1em 0.4em 0.4em;*/
    padding:10px;
    border-top: 1px solid #E6E6E6;
}

/* The rest of the output_* classes are for special styling of the different
   output types */

/* all text output has this class: */
div.output_text {
    text-align: left;
    color: black;
    font-family: monospace;
}

/* stdout/stderr are 'text' as well as 'stream', but pyout/pyerr are *not* streams */
/*div.output_stream {
    padding-top: 0.0em;
    padding-bottom: 0.0em;
}*/

div.output_stream pre {
    max-height:200px;
    overflow-y:auto;
}

div.output_stdout {
}
div.output_stderr {
    background: #fdd; /* very light red background for stderr */
}

div.output_latex {
    text-align: left;
    color: black;
}

div.output_html {
}

div.output_png {
}

div.output_jpeg {
}

.text_cell {
    background-color: white;
    padding: 0 0 0 28px;
}

.text_cell, .text_cell .CodeMirror, .output_html {
    font-family: 'Whitney Book', Arial, Helvetica, Geneva, sans-serif;
}

div.text_cell_input {
    color: black;
    border: 1px solid #ddd;
    border-radius: 3px;
}

div.text_cell_render {
    font-family: 'Whitney Book', Arial, Helvetica, Geneva, sans-serif;
    outline: none;
    resize: none;
    width:  inherit;
    border-style: none;
    padding: 5px;
    color: black;
}

.CodeMirror {
    line-height: 1.231;  /* Changed from 1em to our global default */
}

.CodeMirror-cursor {
    overflow: visible !important;
}

.CodeMirror-scroll {
    height: auto;     /* Changed to auto to autogrow */
    /*  The CodeMirror docs are a bit fuzzy on if overflow-y should be hidden or visible.*/
    /*  We have found that if it is visible, vertical scrollbars appear with font size changes.*/
    overflow-y: hidden;
    overflow-x: auto; /* Changed from auto to remove scrollbar */
}

/* CSS font colors for translated ANSI colors. */


.ansiblack {color: black;}
.ansired {color: darkred;}
.ansigreen {color: darkgreen;}
.ansiyellow {color: brown;}
.ansiblue {color: darkblue;}
.ansipurple {color: darkviolet;}
.ansicyan {color: steelblue;}
.ansigrey {color: grey;}
.ansibold {font-weight: bold;}

.completions , .tooltip {
    position: absolute;
    z-index: 10;
    overflow: auto;
    border: 1px solid black;
    width: 350px;
}

.completions #asyoutype {
    /* Make sure that the height is fixed, even if there isn't matched text in the asyoutype area */
    height: 1em;
}

.completions select {
    background: white;
    outline: none;
    border: none;
    padding: 0px;
    margin: 0px;
    font-family: monospace;
    width: 350px;
}

.completions .detail {
    background-color: #FDFEE2;
}

@-moz-keyframes fadeIn {
    from {opacity:0;}
    to {opacity:1;}
}

@-webkit-keyframes fadeIn {
    from {opacity:0;}
    to {opacity:1;}
}

@keyframes fadeIn {
    from {opacity:0;}
    to {opacity:1;}
}

/*"close" "expand" and "Open in pager button" of
/* the tooltip*/
.tooltip a {
    float:right;
}

/*properties of tooltip after "expand"*/
.bigtooltip {
    height:30%;
}

/*properties of tooltip before "expand"*/
.smalltooltip {
    text-overflow: ellipsis;
    overflow: hidden;
    height:15%;
}

.tooltip {
    /*transition when "expand"ing tooltip */
    -webkit-transition-property: height;
    -webkit-transition-duration: 1s;
    -moz-transition-property: height;
    -moz-transition-duration: 1s;
    transition-property: height;
    transition-duration: 1s;
    max-width:700px;
    border-radius: 0px 10px 10px 10px;
    box-shadow: 3px 3px 5px #999;
    /*fade-in animation when inserted*/
    -webkit-animation: fadeIn 200ms;
    -moz-animation: fadeIn 200ms;
    animation: fadeIn 200ms;
    vertical-align: middle;
    background: #FDFDD8;
    outline: none;
    padding: 3px;
    margin: 0px;
    font-family: monospace;
    min-height:50px;
}

/*fixed part of the completion*/
.completions p b {
    font-weight:bold;
}

.completions p {
    background: #DDF;
    /*outline: none;
    padding: 0px;*/
    border-bottom: black solid 1px;
    padding: 1px;
    font-family: monospace;
}

pre.dialog {
    background-color: #f7f7f7;
    border: 1px solid #ddd;
    border-radius: 3px;
    padding: 0.4em;
    padding-left: 2em;
}

p.dialog {
    padding : 0.2em;
}

.shortcut_key {
    display: inline-block;
    width: 20ex;
    text-align: right;
    font-family: monospace;
}

.shortcut_descr {
}

/* Word-wrap output correctly.  This is the CSS3 spelling, though Firefox seems
   to not honor it correctly.  Webkit browsers (Chrome, rekonq, Safari) do.
 */
pre, code, kbd, samp { white-space: pre-wrap; }

/* These h* rules were taken from Bootstrap before I gutted Bootstrap of all the things that conflicted with
 * standard styling.
 */
h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0;
  font-family: inherit;
  font-weight: bold;
  color: inherit;
  text-rendering: optimizelegibility;
}
h1 small,
h2 small,
h3 small,
h4 small,
h5 small,
h6 small {
  font-weight: normal;
  color: #999999;
}
h1 {
  font-size: 30px;
  line-height: 36px;
}
h1 small {
  font-size: 18px;
}
h2 {
  font-size: 24px;
  line-height: 36px;
}
h2 small {
  font-size: 18px;
}
h3 {
  line-height: 27px;
  font-size: 18px;
}
h3 small {
  font-size: 14px;
}
h4,
h5,
h6 {
  line-height: 18px;
}
h4 {
  font-size: 14px;
}
h4 small {
  font-size: 12px;
}
h5 {
  font-size: 12px;
}
h6 {
  font-size: 11px;
  color: #999999;
  text-transform: uppercase;
}

/* This is a nonsense for Bootstrap. TODO: revisit it when we retheme this whole thing.
 */
.btn:link {
  font-family: "Segoe UI",Arial,Helvetica,Geneva,sans-serif;
  text-decoration: none;
}